import Vue from 'vue';
import toastVue from './toast.vue'

const ToastConstructor = Vue.extend(toastVue);
let toastPool = [];

let getAnInstance = () => {
  if (toastPool.length > 0) {
    let instance = toastPool[0];
    toastPool.splice(0, 1);
    return instance;
  }
  return new ToastConstructor({
    el: document.createElement('div')
  });
};

let returnAnInstance = (instance) => {
  if (instance) {
    toastPool.push(instance);
  }
};

let removeDom = (event) => {
  if (event.target.parentNode) {
    event.target.parentNode.removeChild(event.target);
  }
};

ToastConstructor.prototype.close = function() {
  this.visible = false;
  this.$el.addEventListener('transitionend', removeDom);
  this.closed = true;
  returnAnInstance(this);
};

let Toast = (options = {}) => {
  return new Promise ((resolve, reject) => {
    let duration = options.duration || 3000;
    console.log(options)
    let instance = getAnInstance();
    instance.closed = false;
    clearTimeout(instance.timer);
    instance.message = typeof options === 'string' ? options : options.message;
    instance.position = options.position || 'middle';
    instance.className = options.className || '';
    instance.iconClass = options.iconClass || '';
    document.body.appendChild(instance.$el);
    Vue.nextTick(function() {
      instance.visible = true;
      instance.$el.removeEventListener('transitionend', removeDom);
      ~duration && (instance.timer = setTimeout(function() {
        if (instance.closed) return;
        instance.close();
        resolve();
      }, duration));
    });
    return instance;
  })
};

const install = function (Vue, opts = {}) {
  Vue.prototype.$toast = Toast
}

export default {install, Toast};
